<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="icon" href="/images/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
    <script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
    <meta charset="UTF-8">
    <title>防骚扰-管理员登录</title>
</head>
<body>
<% include ../top/admin_top.ejs %>
<div class="layui-container">
    <div class="layui-row">
        <h1 style="margin-left:110px; margin-top: 100px;">请登录。</h1>
    </div>
    <div class="layui-row">
        <form class="layui-form" action="" style="margin-right: 100px; margin-top: 60px; width: 500px">
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label>
                        <input type="text" style="border-radius: 15px;height: 60px;font-size: 16px; padding-left: 20px"
                               name="username" required lay-verify="required" placeholder="管理员 ID" autocomplete="off"
                               class="layui-input">
                    </label>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <label>
                        <input type="password"
                               style="border-radius: 15px;height: 60px;font-size: 16px; padding-left: 20px; padding-right: 30px"
                               name="password" required lay-verify="required" placeholder="密码" autocomplete="off"
                               class="layui-input">
                    </label>
                </div>
                <div>
                    <h6 id="pwd_waring" style="margin-left: 130px;margin-top: 5px;color: crimson" hidden>&#10006;
                        ID或密码错误</h6>
                </div>
            </div>
            <div class="layui-form-item" style="margin-top: 50px">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-fluid layui-btn-normal"
                            style="border-radius: 15px; height: 60px; background: #0d6eda;font-size: 16px" lay-submit
                            lay-filter="form_submit">登 录
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>

<script>
    layui.use(['form', 'jquery'], function () {
        var form = layui.form;
        var $ = layui.jquery;
        //监听提交
        form.on('submit(form_submit)', function (data) {
            console.log(data)
            $.ajax({
                type: "post",
                url: "http://<%= server_host %>/admin/login",
                data: JSON.stringify(data.field),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (res) {
                    if (res.data.result === true) {
                        console.log(res.data)
                        localStorage.setItem("token", res.data['token'])
                        localStorage.setItem("username", res.data['username'])
                        localStorage.setItem("nickname", res.data['nickname'])
                        window.location.href = "/admin/success"
                    } else {
                        $('#pwd_waring').show();
                    }
                }
            });
            return false;
        });

        $("input").on('input', function () {
            $('#pwd_waring').hide()
        });
    });
</script>
</html>